/*
 * @Author jiangzhiwei
 * @Date 2023-07-22 15:19:11
 * @LastEditors jiangzhiwei
 * @LastEditTime 2023-07-24 18:14:14
 * @FilePath \test-cron\src\components\yc-cron\components\panes\common-time-pane\index.js
 * @Description 通用时间面板
 */
import { defineComponent, markRaw } from 'vue-demi'
import { DEFAULT_TIME_DESCRIPTIONS, parseConfig } from '../../../utils/config'
import { h } from '../../../utils/domutil'
import paneMixin from '../mixins/panemixin'
import CommonPerOption from '../../options/common-per-option'
import CommonDurationOption from '../../options/common-duration-option'
import CommonStartOption from '../../options/common-start-option'
import CommonDesignateOption from '../../options/common-designate-option'

const NAME = 'yc-cron-time-pane'

export default defineComponent({
  name: NAME,
  mixins: [paneMixin],
  props: {
    /** 分类。秒/分钟/小时/月 */
    category: {
      type: String,
      default: '秒'
    },
    /** 时间总数。如1分钟内有60秒 */
    total: {
      type: Number,
      default: 60
    },
    /** 时间起始值 */
    startNum: {
      type: Number,
      default: 0
    }
  },
  data () {
    const total = this.total
    const startNum = this.startNum
    return {
      /** 各个选项的配置信息 */
      options: [
        { label: markRaw(CommonPerOption) },
        { label: markRaw(CommonDurationOption), props: { total, startNum } },
        { label: markRaw(CommonStartOption), props: { total, startNum } },
        { label: markRaw(CommonDesignateOption), props: { total, startNum } }
      ]
    }
  },
  computed: {
    descriptions () {
      return parseConfig(DEFAULT_TIME_DESCRIPTIONS, { category: this.category })
    }
  },
  render () {
    return h('ul', this.generateOptionNodes())
  }
})
